<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>档案接收</title>
    <meta name="renderer" content="webkit" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport"
        content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <link rel="stylesheet" href="../../css/receive.css">
    <link rel="stylesheet" href="../../iconfont/iconfont.css">
</head>

<body>
    <div class="bodyBox">
        <!--数据表格-->
        <table class="layui-hide" id="tableId" lay-filter="tableId">
        </table>
    </div>
    <script src="../../layui/layui.all.js"></script>
    <script>
        var tableIns;
        layui.use(['jquery', 'element', 'layer', 'form', 'table', 'laydate',], function () {
            var $ = layui.$,
                form = layui.form,
                table = layui.table,
                layer = layui.layer,
                laydate = layui.laydate
            tableIns = table.render({
                elem: '#tableId'   //渲染的目标对象
                , url: '../../../data/czrz.json' //数据接口
                , title: '档案详情表'//数据导出来的标题
                , height: 'full-200'
                , cellMinWidth: 80 //设置列的最小默认宽度
                , page: 1  //是否启用分页, limits: [10, 20, 30]
                , limits: [10, 50, 100]
                , limit: 10//默认采用3
                , cols: [[   //列表数据
                    { type: "checkbox" }
                    , { field: 'id', title: '', align: 'center', hide: true }
                    , { field: 'username', title: '操作人工号', align: 'center', event: 'setCode' }
                    , { field: 'realname', title: '操作人姓名', align: 'center', event: 'setName' }
                    , {
                        field: 'type', title: '档案类型', templet: function (d) {
                            return checkType(d.type)
                        }, align: 'center'
                    }
                    , { field: 'jtcz', title: '具体操作', align: 'center' }
                    , { field: 'cztime', title: '操作时间', align: 'center' }

                ]], done: function (res, curr, count) {
                    $('th').css({
                        'background-color': '#d3e0f4',
                    })
                }
            })

            //判断操作类型
            function checkType(type) {
                if (type == '1') {
                    return '<span style="color: blue;">打印</span>'
                } else if (type == '2') {
                    return '<span style="color: blue;">借阅</span>'
                } else if (type == '3') {
                    return '<span style="color: blue;">归还</span>'
                } else if (type == '4') {
                    return '<span style="color: blue;">调出</span>'
                } else if (type == '5') {
                    return '<span style="color: blue;">接收</span>'
                }
            }

        })

    </script>

</body>

</html>